use(["public/javascripts/service/registerService.js",
        "public/common/classNames.js",
        "public/javascripts/register/view.js",
        "public/javascripts/widget/step/step.js",
        "public/common/des.js"
    ],
    function(registerService,classNames,jQView,StepComponent,Des) {
        var cn = classNames;
        var PageComponent = React.createClass({
            eventObj: {},
            countdown: 60,
            componentDidMount: function() {
                jQView.init();

                $("#tips").hover(function () {
                    $("#tipsMsg").css('display','block')

                },function () {
                    $("#tipsMsg").css('display','none')
                })

                $("#companyName").attr('maxlength','30');
                $("#userName").attr('maxlength','30');
                $("#password").attr('maxlength','18');
                $('#passwordConfirm').attr('maxlength','18');
                $("#phoneNumber").attr('maxlength',"11");



            },
            receiveMsg: function(data) {

            },
            getInitialState: function () {
                return {
                    companyName: '',
                    companyNameErr:false,
                    userName:'',
                    userNameExist:false,
                    userNameFormatErr:false,
                    phoneNumber:'',
                    phoneNumberErr:false,
                    phoneExist:false,
                    identifyCode:'',
                    identifyCodeErr:false,
                    password:'',
                    ExistNoSupWord:false,
                    passWordLevel:'',
                    ExistPwLow:false,
                    passwordConfirm:'',
                    passwordNotSame:false,
                    imageUrl:''
                };
            },
            ChangeValue: function(event) {
                var name = event.target.name;
                var value = event.target.value;
                this.eventObj[name] = value;
                this.setState(this.eventObj);
            },
            /*企业名称校验部分*/
            CheckCompanyName:function () {
                var reg = /^([\w\u4E00-\u9FA5_\-]+)+$/;
                if(!reg.test(this.state.companyName)){
                    this.setState({companyNameErr:true})
                    this.setPhoneVerticalInvalid();
                }else{
                    this.setState({companyNameErr:false})
                }

            },
            /*用户名称校验部分*/
            checkUserNameFormat:function () {
                var regFormat = /^([\w_\-]+)+$/;
                var userFormatOK = regFormat.test(this.state.userName);

                if(userFormatOK) {
                    this.setState({userNameFormatErr: false});
                }else{
                    this.setState({userNameFormatErr: true});
                    this.setPhoneVerticalInvalid();
                }

            },
            checkUserName:function () {
                /*用户名称异步校验部分*/
                var that = this;

                if(!this.state.userName) {
                    return;
                }

                var param={
                    code:this.state.userName
                }

                registerService.checkUserExist(param,function (returnData) {
                    if(returnData.errorCode == 0 && returnData.data == true){
                        that.setState({userNameExist: true});
                        that.setPhoneVerticalInvalid();
                    }else {
                        that.setState({userNameExist: false},function () {
                            that.showPhoneVertical();
                        });

                    }
                })
            },
            clearUserExistTip:function () {
                this.setState({userNameExist: false});
            },
            /*密码设置校验部分*/
            checkPwFormat:function (event) {

                console.log(this.state.password)
                var password = this.state.password;

                var O_color = "#eeeeee";
                var L_color = "#f6cd8a";
                var M_color = "#fab749 ";
                var H_color = "#f68c23";
                var level = 0;

                var mode = 0;
                var Lcolor;
                var Mcolor;
                var Hcolor;

                this.setState({ExistNoSupWord: false});
                this.setState({ExistPwLow: false});

                if (password == null || password == ''|| password == undefined) {
                    Lcolor = Mcolor = Hcolor = O_color;
                    mode = 0;

                }else{
                    console.log(password.length,"password.length")
                    for (var index = 0; index < password.length; index++) {
                        var charMode;
                        var regSpecial = /((?=[\x21-\x7e]+)[^A-Za-z0-9])/;
                        var regNumber = /[0-9]+/;
                        var regLowercase = /[a-z]+/;
                        var regCapital = /[A-Z]+/;

                        var singleWord = password.charAt(index);
                        console.log(singleWord,"singleWord");

                        // 判断输入密码的类型
                        if (regNumber.test(singleWord)) { //数字
                            charMode = 1;
                        }
                        else if (regCapital.test(singleWord)) //大写
                            charMode = 2;
                        else if (regLowercase.test(singleWord)) //小写
                            charMode = 4;
                        else if(regSpecial.test(singleWord)){
                            charMode = 8;  //特殊字符
                        }else{
                            //不支持的字符
                            this.setState({ExistNoSupWord: true});
                            this.initPasswordStrength();
                            return;
                        }

                        mode |= charMode;

                        var typeNumber = this.CalcLevel(mode);

                    }

                    console.log(password.length,"password.length");
                    console.log(typeNumber,"typeNumber");

                    if( typeNumber== 0 || password.length >18){
                        Lcolor = Mcolor = Hcolor = O_color;
                        this.setState({passWordLevel: 'original'});

                    }else if(password.length < 6 || (typeNumber <= 2) ){
                        Lcolor = L_color;
                        Mcolor = Hcolor = O_color; ///低优先级
                        this.setState({passWordLevel: 'low'});
                    }else if((password.length >=6 && password.length <=9 && typeNumber == 3) ||
                        (password.length >=6 && password.length <=7 && typeNumber == 4)){
                        Lcolor = Hcolor = O_color;
                        Mcolor = M_color; ///中级
                        this.setState({passWordLevel: 'normal'});
                    }else if((password.length >=10 && password.length <=18 && typeNumber == 3) ||
                        (password.length >=8 && password.length <=18 && typeNumber == 4))
                    {
                        Hcolor = H_color; ///高级
                        Lcolor = Mcolor = O_color;
                        this.setState({passWordLevel: 'high'});
                    }else{
                        Lcolor = Mcolor = Hcolor = O_color;
                        this.setState({passWordLevel: 'original'});
                    }

                }
                document.getElementById("strength_L").style.background = Lcolor;
                document.getElementById("strength_M").style.background = Mcolor;
                document.getElementById("strength_H").style.background = Hcolor;
            },
            CheckNewPwRule:function () {
                if(this.state.passWordLevel == 'original' ||
                    this.state.passWordLevel == 'low'){
                    this.setState({ExistPwLow: true});
                }else{
                    this.setState({ExistPwLow: false});
                }

                if(this.state.password && this.state.passwordConfirm && this.state.passwordConfirm !== this.state.password) {
                    this.setState({passwordNotSame: true},function () {
                        this.setPhoneVerticalInvalid();
                    });
                }else{
                    this.setState({passwordNotSame: false},function () {
                        this.showPhoneVertical();
                    });
                }
            },
            /*密码确认部分*/
            checkPasswordConfirm:function () {
                if(this.state.password && this.state.passwordConfirm && this.state.passwordConfirm !== this.state.password ) {
                    this.setState({passwordNotSame: true},function () {
                        this.setPhoneVerticalInvalid();
                    });
                }else{
                    this.setState({passwordNotSame: false},function () {
                        this.showPhoneVertical();
                    });
                }
            },
            /*手机号码校验部分 开始只是校验数字部分*/
            checkPhoneNumberFormat:function () {
                var reg = /^[0-9]*$/;
                if(!reg.test(this.state.phoneNumber)){
                    this.setPhoneVerticalInvalid();
                    this.setState({phoneNumberErr: true});
                }else{
                    /*如果输入了11位数，则校验号码段，如果满足条件，继续校验唯一性*/
                    if(this.state.phoneNumber.length == 11){
                        var reg2 = /^1[356789][0-9]*$/;
                        if(!reg2.test(this.state.phoneNumber) ){
                            this.setState({phoneNumberErr:true})
                            this.setPhoneVerticalInvalid();
                        }else{
                            this.setState({phoneNumberErr:false})
                            this.checkPhoneNumberUnique();
                        }
                    }else{
                        /*未到11位，只要输入数字，就不校验，只是不显示验证码*/
                        this.setState({phoneNumberErr: false});
                        this.setPhoneVerticalInvalid();
                    }
                }
            },
            checkPhoneNumberUnique:function () {
                var that = this;


                /*增加异步校验*/
                var param = {
                    "mobilePhone":that.state.phoneNumber
                }

                registerService.checkPhoneExist(param,function (returnData) {

                    if(returnData.errorCode == 0 && returnData.data == true){
                        that.setState({phoneExist: true});
                        that.setPhoneVerticalInvalid();
                    }else {
                        that.setState({phoneExist: false});
                        /*显示验证码*/
                        that.showPhoneVertical();
                    }
                })
            },
            checkPhoneNumbers:function () {
               /*blur的时候校验手机位数和格式 此时校验位数和号码段*/
               if(!this.state.phoneNumber) {return;}

               var reg = /^1[356789][0-9]*$/;
               if(!reg.test(this.state.phoneNumber) || this.state.phoneNumber.length != 11) {
                   this.setState({phoneNumberErr:true})
                   this.setPhoneVerticalInvalid();
               }else{
                   this.checkPhoneNumberUnique();
                   this.setState({phoneNumberErr:false})
               }

            },
            showPhoneVertical:function () {

                var checkErr = this.checkPhoneVertial();

                if(this.countdown == 60 && checkErr){
                    this.setPhoneVerticalValid();
                }else{
                    this.setPhoneVerticalInvalid();
                }
            },
            clearPasswordNotSameTip:function () {
                this.setState({passwordNotSame: false});
            },
            clearPhoneExistTip:function () {
                this.setState({phoneExist: false});
            },
            setPhoneVerticalInvalid:function () {
                $('#phone-vertical').attr('disabled',true)
                $('#phone-vertical').css('color','#d6dae6')
                $('#phone-vertical').css('cursor','not-allowed')

            },
            setPhoneVerticalValid:function () {
                console.log("hihihi")
                $('#phone-vertical').attr('disabled',false)
                $('#phone-vertical').css('color','#eb4b51')
                $('#phone-vertical').css('cursor','pointer')
            },
            clickToGetPhoneVerticalNumber:function () {

                var flag = $('#phone-vertical').attr('disabled');
                if(!this.state.phoneNumber || this.state.phoneNumberErr || flag == 'disabled') {
                    return;
                }

                this.getPhoneVerticalNumber();

            },
            FocusOnIdentifyCode:function () {
                this.setState({identifyCodeErr:false})
            },
            getPhoneVerticalNumber:function () {

                var param={
                    mobilePhone:this.state.phoneNumber
                }

                if (this.countdown == 0) {
                    this.setPhoneVerticalValid();
                    this.countdown = 60;
                    console.log("60s after")
                    $('#phone-vertical').text("重新发送")
                    return;
                } else {
                    if(this.countdown == 59){
                        registerService.getVertifyCode(param,function (returnData) {

                            if(returnData.errorCode !=0) {


                            }else{
                                if(!returnData.data){
                                    $("#vertify-error").css('display','block')
                                }else{
                                    $("#vertify-error").css('display','none')
                                }

                            }
                        })

                    }
                    this.setPhoneVerticalInvalid();

                    $('#phone-vertical').text("重新发送(" + this.countdown + ")");
                    this.countdown--;
                }
                var that = this;
                setTimeout(function() {
                        that.getPhoneVerticalNumber() }
                    ,1000)

            },

            initPasswordStrength:function() {
                var O_color = "#eeeeee";
                document.getElementById("strength_L").style.background = O_color;
                document.getElementById("strength_M").style.background = O_color;
                document.getElementById("strength_H").style.background = O_color;
                this.setState({passWordLevel: 'original'});

            },
            CalcLevel:function(mode) {
                var level = 0;
                for(var indexj=0;indexj<4;indexj++){
                    if(mode & 1) {
                        level++;
                    }
                    mode >>>=1;
                }
                return level;

            },

            checkPhoneVertial:function () {

                if(!this.state.companyName || this.state.companyNameErr){
                    console.log('companyName')
                    return false;
                }

                if(!this.state.userName || this.state.userNameExist || this.state.userNameFormatErr){
                    console.log('userName')
                    return false;
                }

                if(!this.state.password || this.state.ExistPwLow || this.state.ExistNoSupWord){
                    console.log('password')
                    return false;
                }

                if(!this.state.passwordConfirm || this.state.passwordNotSame){
                    console.log('passwordConfirm')
                    return false;
                }

                if(!this.state.phoneNumber || this.state.phoneNumberErr || this.state.phoneExist){
                    console.log('phoneNumber')
                    return false;
                }

                return true;
            },
            checkParams:function () {
                if(!this.state.companyName || this.state.companyNameErr){
                    console.log('companyName')
                    return false;
                }

                if(!this.state.userName || this.state.userNameExist || this.state.userNameFormatErr){
                    console.log('userName')
                    return false;
                }
                if(!this.state.phoneNumber || this.state.phoneNumberErr || this.state.phoneExist){
                    console.log('phoneNumber')
                    return false;
                }
                if(!this.state.identifyCode){
                    console.log('identifyCode')
                    return false;
                }

                if(!this.state.password || this.state.ExistPwLow || this.state.ExistNoSupWord){
                    console.log('password')
                    return false;
                }

                if(!this.state.passwordConfirm || this.state.passwordNotSame){
                    return false;
                }


                return true;

            },
            register:function () {
                var that = this;

                if(this.checkParams() != true){
                    console.log("some wrong")
                    return;
                }

                var params={
                    userName:this.state.companyName,
                    code:this.state.userName,
                    telNo:this.state.phoneNumber,
                    validateCode:this.state.identifyCode,
                    password:Des.enc(this.state.password)
                };

                registerService.clientRegister(params,function (returnData) {
                    console.log(returnData);
                    if(returnData.errorCode === 0){
                        cookie.set('token', returnData.data.token, 1);
                        window.location.href='http://' + location.host+'/ent_auth';
                    }else{
                        if(returnData.errorCode === -1){
                            that.setState({identifyCodeErr:true})
                        }
                    }
                })

            },
            refuseSubmit:function(e){
                e.preventDefault();
                return false;

            },
            render:function() {
                var data = this.state.data;
                return ~init;
            }
        });
        if(typeof ReactDOM != "undefined") {
            ReactDOM.render(<PageComponent data={storage}/>, document.getElementById('container'));
        }
        module.exports = PageComponent;
    });